.upload-drop-zone__dropzone {
	position: relative;
	background-color: var( --color-neutral-0 );
	border: 2px dashed var( --color-neutral-light );
	transition: all 200ms ease-out, color 100ms ease-out;
	cursor: pointer;

	svg * {
		transition: color 100ms ease-out;
	}

	.file-picker {
		color: var( --color-neutral-70 );
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		height: 180px;
	}

	&:hover {
		border-color: var( --color-neutral-70 );
		transform: translate3d( 0, -1px, 0 );
		box-shadow: 0 2px 4px var( --color-neutral-10 );

		.upload-drop-zone__icon {
			color: var( --color-neutral-70 );
		}
	}
}

.upload-drop-zone__icon {
	color: var( --color-neutral-light );
}

.upload-drop-zone__instructions {
	font-style: italic;
	font-size: $font-body-extra-small;
}


.upload-drop-zone {
	&.is-disabled {
		opacity: 0.2;
		pointer-events: none;
	}
}
